@-webkit-keyframes flipSlideZIn {
  0% {
    -webkit-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
            transform: perspective(400px) rotateY(180deg) rotateZ(90deg) translateX(-100%) translateY(100%);
    -webkit-transform-origin:center center;
            transform-origin:center center;
            opacity:0;
  }
  100% {
    -webkit-transform: perspective(400px) rotate(0) translate(0);
            transform: perspective(400px) rotate(0) translate(0);
     -webkit-transform-origin:center center;
            transform-origin:center center;
            opacity: 1;
  }
}
@keyframes flipSlideZIn {
  0% {
    -webkit-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
    -moz-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
    -ms-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
        transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
    -webkit-transform-origin:center center;
       -moz-transform-origin:center center;
        -ms-transform-origin:center center;
            transform-origin:center center;
            opacity: 0;
  }
  100% {
    -webkit-transform: perspective(400px) rotate(0) translate(0);
       -moz-transform: perspective(400px) rotate(0) translate(0);
        -ms-transform: perspective(400px) rotate(0) translate(0);
            transform: perspective(400px) rotate(0) translate(0);
     -webkit-transform-origin:center center;
       -moz-transform-origin:center center;
        -ms-transform-origin:center center;
            transform-origin:center center;
            opacity: 1;
  }
}
@-webkit-keyframes flipSlideZOut {
  100% {
    -webkit-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
            transform: perspective(400px) rotateY(180deg) rotateZ(90deg) translateX(-100%) translateY(100%);
    -webkit-transform-origin:center center;
            transform-origin:center center;
            opacity:0;
  }
  0% {
    -webkit-transform: perspective(400px) rotate(0) translate(0);
            transform: perspective(400px) rotate(0) translate(0);
     -webkit-transform-origin:center center;
            transform-origin:center center;
            opacity: 1;
  }
}
@keyframes flipSlideZOut {
  100% {
    -webkit-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
    -moz-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
    -ms-transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
        transform: perspective(400px) rotateY(180deg) rotateZ(90deg)  translateX(-100%) translateY(100%);
    -webkit-transform-origin:center center;
       -moz-transform-origin:center center;
        -ms-transform-origin:center center;
            transform-origin:center center;
            opacity: 0;
  }
  0% {
    -webkit-transform: perspective(400px) rotate(0) translate(0);
       -moz-transform: perspective(400px) rotate(0) translate(0);
        -ms-transform: perspective(400px) rotate(0) translate(0);
            transform: perspective(400px) rotate(0) translate(0);
     -webkit-transform-origin:center center;
       -moz-transform-origin:center center;
        -ms-transform-origin:center center;
            transform-origin:center center;
            opacity: 1;
  }
}